<!--企业文化-新增-->
<template xmlns:v-on="http://www.w3.org/1999/xhtml">
  <div class="opNotice">
    <div class="opNoticeTop">
      <div>编辑资讯</div>
    </div>
    <div class="opNoticeMain">
      <div class="item">
        <div>发送范围
          <span>*</span>：</div>
        <div>
          <input readonly="readonly" type="text" v-model="userInfoVal" @click="setReceiverClick" :class="{redBorder:isRedReceiveVal,grayBorder:isGrayReceiveVal}"
            placeholder="选择部门">
          <div id="inputTips" :class="{redTest:isRedReceiveVal,grayTest:isGrayReceiveVal}">请选择部门</div>
        </div>
      </div>
      <div class="item">
        <div>主题
          <span>*</span>：</div>
        <div>
          <input type="text" v-model="titleVal" maxlength="35" :class="{redBorder:isRedTitleVal,grayBorder:isGrayTitleVal}" placeholder="最多35个汉字">
          <div id="inputTips" :class="{redTest:isRedTitleVal,grayTest:isGrayTitleVal}">请输入标题(不能含特殊字符)</div>
        </div>
      </div>
      <div class="item">
        <div>类目
          <span>&nbsp;&nbsp;</span>：</div>
        <div>
          <input v-show="!isShowSelectOrInput" type="text" v-model="regimeVal" :class="{redBorder:isRedRegimeVal,grayBorder:isGrayRegimeVal}" disabled>
          <select v-show="isShowSelectOrInput" v-model="regimeVal" :class="{redBorder:isRedRegimeVal,grayBorder:isGrayRegimeVal}" @change="selectregimeVal">
            <option v-for="(item,index) in regimeLists" :key="index" :value="item.id">{{item.name}}</option>
          </select>
          <!-- <div id="inputTips" :class="{redTest:isRedRegimeVal,grayTest:isGrayRegimeVal}">请选择类目</div> -->
        </div>
      </div>
      <div class="item">
        <div>正文
          <span>*</span>：</div>
        <div class="editorBox" :class="{redBorder:isRedContentHtmlVal,grayBorder:isGrayContentHtmlVal}">
          <div id="editorId" tabindex="-1">

          </div>
          <!-- <div id="editorTips" :class="{redTest:isRedContentHtmlVal,grayTest:isGrayContentHtmlVal}">正文(不能含特殊字符)</div> -->
        </div>
      </div>
      <div class="item">
        <div>封面图片
          <span></span>：</div>
        <div>
          <img :src="coverImg" alt="">
          <input id="logofile" type="file" style="display: none;" accept="image/jpeg,image/jpg,image/png,image/bmp,image/gif" @change="onFileChange">
          <span id="coverImgTips" :class="{redTest:isRedcoverImgVal,grayTest:isGraycoverImgVal}">图片尺寸为750*300像素,文件类型.jpg,.jpeg,.bmp,.gif,.png,大小不超过5M</span>
          <br>
          <input type="button" value="上传" @click="upload">
        </div>
      </div>
      <div class="button">
        <el-button type="primary" size="medium" @click="saveClick">保存</el-button>
        <el-button type="info" size="medium" @click="cancelsClick">取消</el-button>
      </div>
    </div>
    <!-- 弹出框选择部门人员组件 -->
    <v-addDeptis :updatePop="DeptupdatePopShow" @affirm="affirmUserListsClick" @cancel="DeptcancelUserListsClick" :Deptselectpop="DeptselectpopLists"></v-addDeptis>
  </div>
</template>
<script>
import { mapActions } from "vuex";
import WangEditor from "wangeditor";
const crypto = require("crypto");
import addDeptis from "../../../cModel/addOnllyDeptis.vue";
export default {
  components: {
    "v-addDeptis": addDeptis
  },
  data() {
    return {
      DeptupdatePopShow: false,
      DeptselectpopLists: [],
      DeptselectpopListCopys: [],
      updatePopShow: false, // 人员选择列表
      userselectpopLists: [], // 已选中的人员-编辑时使用

      orgIdVal: "",
      catalogIdVal: "",
      idVal: "",
      deptStr: "",
      userStr: "",
      regimeLists: [],

      userInfoVal: "", // 发送范围
      isRedReceiveVal: false,
      isGrayReceiveVal: true,

      isRedContentHtmlVal: false, // 正文
      isGrayContentHtmlVal: true, // 正文

      titleVal: "", // 标题
      isRedTitleVal: false,
      isGrayTitleVal: true,

      regimeVal: "企业文化", // 类目
      isRedRegimeVal: false,
      isGrayRegimeVal: true,
      editor: "",
      editorData: null, //编辑器对象
      inputContentHtml: "", //渲染编辑器html
      contentVal: "", //编辑器html字符串
      inputText: "", //编辑器文本字符串

      isRedcoverImgVal: false,
      isGraycoverImgVal: true,
      coverImg: "/static/img/123.png",

      saveClickTrueOrFalse: true,
      isShowSelectOrInput: false
    };
  },
  filters: {},
  created: function() {},
  mounted() {
    var self = this;
    self.orgIdVal = sessionStorage.getItem("ORGID");
    self.catalogIdVal = sessionStorage.getItem("catalogIdVal");
    self.idVal = sessionStorage.getItem("idVal");
    self.getListDetail();
    self.IdlistFun();
  },
  methods: {
    // 选择部门取消
    DeptcancelUserListsClick(val) {
      var self = this;
      if (val.length > 0) {
        self.DeptselectpopListCopys = val;
      }
      this.$store.commit("setMutviewShow", false);
      this.DeptupdatePopShow = false;
    },
    // 选择成员
    setReceiverClick() {
      var self = this;
      if (self.DeptselectpopListCopys.length > 0) {
        self.DeptselectpopLists = self.DeptselectpopListCopys;
      }
      this.$store.commit("setMutviewShow", true);
      this.DeptupdatePopShow = true;
    },
    // 选择人员确认
    affirmUserListsClick(val) {
      var self = this;
      if (val) {
        if (val.length > 0) {
          var deptListsArr = [];
          var deptStr = "";
          val.forEach(function(ele, ind) {
            deptListsArr.push(ele.name);
          });
          self.deptStr = val[0].name;
          self.DeptselectpopListCopys = val;
          self.userInfoVal = self.deptStr;
        } else {
          self.DeptselectpopListCopys = [];
          self.userInfoVal = "";
        }
      } else {
        self.DeptselectpopListCopys = [];
        self.userInfoVal = "";
      }
      this.$store.commit("setMutviewShow", false);
      this.DeptupdatePopShow = false;
    },
    // 选择类目
    selectregimeVal() {
      console.log(this.regimeVal);
    },
    // 查询资讯详情
    getListDetail() {
      var self = this;
      self.DeptselectpopListCopys = [];
      self
        .getWebInfoDetail({
          id: self.idVal
        })
        .then(data => {
          if (data.statusCode == 200) {
            if (data.data) {
              self.deptStr = data.data.departmentName;
              self.userInfoVal = data.data.departmentName;
              self.DeptselectpopListCopys.push({
                companyId: "",
                createTime: "",
                id: "",
                memberCount: "",
                name: self.userInfoVal,
                orgType: "",
                parentId: "",
                sortEmpty: ""
              });
              self.titleVal = data.data.title;
              self.inputContentHtml = data.data.content;
              if (data.data.pictureUrl) {
                self.coverImg = data.data.pictureUrl;
              }

              self.contentVal = data.data.content;
              self.createEditorFun();
            }
          } else if (data.statusCode == "200003") {
            self.$message({
              type: "info",
              message: data.statusMessage
            });
            this.$router.push({
              path: "/login"
            });
          } else {
            self.$message({
              type: "info",
              message: data.statusMessage
            });
          }
        })
        .catch(msg => {
          self.$message({
            type: "info",
            message: "服务器异常"
          });
        });
    },
    // 目录结构列表
    IdlistFun() {
      var self = this;
      self
        .getWebInfoParent({
          orgId: self.orgIdVal
        })
        .then(data => {
          if (data.statusCode == 200) {
            if (data.data) {
              if (data.data[0].lower) {
                self.isShowSelectOrInput = true;
                self.regimeLists = data.data[0].lower;
              } else {
                self.isShowSelectOrInput = false;
              }
            }
          } else if (data.statusCode == "200003") {
            self.$message({
              type: "info",
              message: data.statusMessage
            });
            this.$router.push({
              path: "/login"
            });
          } else {
            self.$message({
              type: "info",
              message: data.statusMessage
            });
          }
        })
        .catch(msg => {
          self.$message({
            type: "info",
            message: "服务器异常"
          });
        });
    },
    // 修改
    saveClick() {
      var self = this;
      if (self.validateFun() == false) {
        return false;
      } else {
        if (self.saveClickTrueOrFalse == true) {
          self.saveClickTrueOrFalse = false;
          var obj = {
            id: self.idVal,
            oneCatalogId: self.catalogIdVal,
            orgId: self.orgIdVal,
            departmentName: self.deptStr,
            title: self.titleVal,
            content: self.contentVal
          };
          if (self.coverImg != "/static/img/123.png") {
            obj["pictureUrl"] = self.coverImg;
          }
          if (self.regimeLists.length > 0) {
            obj.catalogId = self.regimeVal;
          }
          var object = JSON.stringify(obj);
          self
            .getWebInfoUpdate(object)
            .then(data => {
              self.saveClickTrueOrFalse = true;
              if (data.statusCode == 200) {
                self.$message({
                  type: "success",
                  message: "修改成功"
                });
                sessionStorage.removeItem("catalogIdVal");
                sessionStorage.removeItem("idVal");
                self.$router.push({
                  path: "/home/information/enterpriseformation"
                });
                self.listFun();
              } else if (data.statusCode == "200003") {
                self.$message({
                  type: "info",
                  message: data.statusMessage
                });
                this.$router.push({
                  path: "/login"
                });
              } else {
                self.$message({
                  type: "info",
                  message: data.statusMessage
                });
              }
            })
            .catch(msg => {
              sessionStorage.removeItem("catalogIdVal");
              sessionStorage.removeItem("idVal");
              self.saveClickTrueOrFalse = true;
              // self.$message({
              //     type: 'info',
              //     message: '服务器异常'
              // })
            });
        }
      }
    },
    // 验证
    validateFun() {
      var self = this;
      var regOne = /^[\s]*$/; //输入不能为空
      var regTwo = new RegExp(/^[\u4e00-\u9fa5]{1,15}$/);
      var regThree = new RegExp(
        "[+`~@#$^&*()=|{}\\[\\]<>/@#￥&*;（）——|{}【】]"
      );
      if (self.userInfoVal.length > 0) {
        self.isRedReceiveVal = false;
        self.isGrayReceiveVal = true;
      } else {
        self.isRedReceiveVal = true;
        self.isGrayReceiveVal = false;
      }
      if (regOne.test(self.titleVal) || regThree.test(self.titleVal)) {
        self.isRedTitleVal = true;
        self.isGrayTitleVal = false;
      } else {
        self.isRedTitleVal = false;
        self.isGrayTitleVal = true;
      }
      if (self.contentVal) {
        if (self.contentVal.length > 0 && self.inputText.length > 0) {
          this.isRedContentHtmlVal = false;
          this.isGrayContentHtmlVal = true;
        } else {
          this.isRedContentHtmlVal = true;
          this.isGrayContentHtmlVal = false;
        }
      } else {
        this.isRedContentHtmlVal = true;
        this.isGrayContentHtmlVal = false;
      }

      if (
        self.isRedTitleVal == true ||
        self.isRedContentHtmlVal == true ||
        self.isRedReceiveVal == true
      ) {
        return false;
      }
    },
    // 关闭弹框
    cancelClick() {
      this.selectPopupShow = false;
    },
    // 编辑器
    createEditorFun() {
      const self = this;
      self.editor = new WangEditor("#editorId");
      self.editorData = self.editor;
      self.editor.customConfig.menus = [
        "head", // 标题
        "bold", // 粗体
        "fontSize", // 字号
        "fontName", // 字体
        "foreColor", // 文字颜色
        "justify", // 对齐方式
        "emoticon", // 表情
        "image" // 插入图片
      ];

      // 表情面板可以有多个 tab ，因此要配置成一个数组。数组每个元素代表一个 tab 的配置
      self.editor.customConfig.emotions = [
        {
          // tab 的标题
          title: "默认",
          // type -> 'emoji' / 'image'
          type: "image",
          // content -> 数组
          content: [
            {
              alt: "[坏笑]",
              src:
                "http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/50/pcmoren_huaixiao_org.png"
            },
            {
              src:
                "http://img.t.sinajs.cn/t35/style/images/common/face/ext/normal/7a/shenshou_thumb.gif",
              alt: "[草泥马]"
            },
            {
              src:
                "http://img.t.sinajs.cn/t35/style/images/common/face/ext/normal/60/horse2_thumb.gif",
              alt: "[神马]"
            },
            {
              src:
                "http://img.t.sinajs.cn/t35/style/images/common/face/ext/normal/bc/fuyun_thumb.gif",
              alt: "[浮云]"
            },
            {
              src:
                "http://img.t.sinajs.cn/t35/style/images/common/face/ext/normal/c9/geili_thumb.gif",
              alt: "[给力]"
            },
            {
              src:
                "http://img.t.sinajs.cn/t35/style/images/common/face/ext/normal/f2/wg_thumb.gif",
              alt: "[围观]"
            },
            {
              src:
                "http://img.t.sinajs.cn/t35/style/images/common/face/ext/normal/70/vw_thumb.gif",
              alt: "[威武]"
            },
            {
              src:
                "http://img.t.sinajs.cn/t35/style/images/common/face/ext/normal/6e/panda_thumb.gif",
              alt: "[熊猫]"
            },
            {
              src:
                "http://img.t.sinajs.cn/t35/style/images/common/face/ext/normal/81/rabbit_thumb.gif",
              alt: "[兔子]"
            },
            {
              src:
                "http://img.t.sinajs.cn/t35/style/images/common/face/ext/normal/bc/otm_thumb.gif",
              alt: "[奥特曼]"
            },
            {
              src:
                "http://img.t.sinajs.cn/t35/style/images/common/face/ext/normal/15/j_thumb.gif",
              alt: "[囧]"
            },
            {
              src:
                "http://img.t.sinajs.cn/t35/style/images/common/face/ext/normal/89/hufen_thumb.gif",
              alt: "[互粉]"
            },
            {
              src:
                "http://img.t.sinajs.cn/t35/style/images/common/face/ext/normal/c4/liwu_thumb.gif",
              alt: "[礼物]"
            },
            {
              src:
                "http://img.t.sinajs.cn/t35/style/images/common/face/ext/normal/ac/smilea_thumb.gif",
              alt: "[呵呵]"
            },
            {
              src:
                "http://img.t.sinajs.cn/t35/style/images/common/face/ext/normal/0b/tootha_thumb.gif",
              alt: "[嘻嘻]"
            },
            {
              src:
                "http://img.t.sinajs.cn/t35/style/images/common/face/ext/normal/6a/laugh.gif",
              alt: "[哈哈]"
            },
            {
              src:
                "http://img.t.sinajs.cn/t35/style/images/common/face/ext/normal/14/tza_thumb.gif",
              alt: "[可爱]"
            },
            {
              src:
                "http://img.t.sinajs.cn/t35/style/images/common/face/ext/normal/af/kl_thumb.gif",
              alt: "[可怜]"
            },
            {
              src:
                "http://img.t.sinajs.cn/t35/style/images/common/face/ext/normal/a0/kbsa_thumb.gif",
              alt: "[挖鼻屎]"
            },
            {
              src:
                "http://img.t.sinajs.cn/t35/style/images/common/face/ext/normal/f4/cj_thumb.gif",
              alt: "[吃惊]"
            },
            {
              src:
                "http://img.t.sinajs.cn/t35/style/images/common/face/ext/normal/6e/shamea_thumb.gif",
              alt: "[害羞]"
            },
            {
              src:
                "http://img.t.sinajs.cn/t35/style/images/common/face/ext/normal/c3/zy_thumb.gif",
              alt: "[挤眼]"
            },
            {
              src:
                "http://img.t.sinajs.cn/t35/style/images/common/face/ext/normal/29/bz_thumb.gif",
              alt: "[闭嘴]"
            },
            {
              src:
                "http://img.t.sinajs.cn/t35/style/images/common/face/ext/normal/71/bs2_thumb.gif",
              alt: "[鄙视]"
            },
            {
              src:
                "http://img.t.sinajs.cn/t35/style/images/common/face/ext/normal/6d/lovea_thumb.gif",
              alt: "[爱你]"
            },
            {
              src:
                "http://img.t.sinajs.cn/t35/style/images/common/face/ext/normal/9d/sada_thumb.gif",
              alt: "[泪]"
            },
            {
              src:
                "http://img.t.sinajs.cn/t35/style/images/common/face/ext/normal/19/heia_thumb.gif",
              alt: "[偷笑]"
            },
            {
              src:
                "http://img.t.sinajs.cn/t35/style/images/common/face/ext/normal/8f/qq_thumb.gif",
              alt: "[亲亲]"
            },
            {
              src:
                "http://img.t.sinajs.cn/t35/style/images/common/face/ext/normal/b6/sb_thumb.gif",
              alt: "[生病]"
            },
            {
              src:
                "http://img.t.sinajs.cn/t35/style/images/common/face/ext/normal/58/mb_thumb.gif",
              alt: "[太开心]"
            },
            {
              src:
                "http://img.t.sinajs.cn/t35/style/images/common/face/ext/normal/17/ldln_thumb.gif",
              alt: "[懒得理你]"
            },
            {
              src:
                "http://img.t.sinajs.cn/t35/style/images/common/face/ext/normal/98/yhh_thumb.gif",
              alt: "[右哼哼]"
            },
            {
              src:
                "http://img.t.sinajs.cn/t35/style/images/common/face/ext/normal/6d/zhh_thumb.gif",
              alt: "[左哼哼]"
            },
            {
              src:
                "http://img.t.sinajs.cn/t35/style/images/common/face/ext/normal/a6/x_thumb.gif",
              alt: "[嘘]"
            },
            {
              src:
                "http://img.t.sinajs.cn/t35/style/images/common/face/ext/normal/af/cry.gif",
              alt: "[衰]"
            },
            {
              src:
                "http://img.t.sinajs.cn/t35/style/images/common/face/ext/normal/73/wq_thumb.gif",
              alt: "[委屈]"
            },
            {
              src:
                "http://img.t.sinajs.cn/t35/style/images/common/face/ext/normal/9e/t_thumb.gif",
              alt: "[吐]"
            },
            {
              src:
                "http://img.t.sinajs.cn/t35/style/images/common/face/ext/normal/f3/k_thumb.gif",
              alt: "[打哈欠]"
            },
            {
              src:
                "http://img.t.sinajs.cn/t35/style/images/common/face/ext/normal/27/bba_thumb.gif",
              alt: "[抱抱]"
            },
            {
              src:
                "http://img.t.sinajs.cn/t35/style/images/common/face/ext/normal/7c/angrya_thumb.gif",
              alt: "[怒]"
            },
            {
              src:
                "http://img.t.sinajs.cn/t35/style/images/common/face/ext/normal/5c/yw_thumb.gif",
              alt: "[疑问]"
            },
            {
              src:
                "http://img.t.sinajs.cn/t35/style/images/common/face/ext/normal/a5/cza_thumb.gif",
              alt: "[馋嘴]"
            },
            {
              src:
                "http://img.t.sinajs.cn/t35/style/images/common/face/ext/normal/70/88_thumb.gif",
              alt: "[拜拜]"
            },
            {
              src:
                "http://img.t.sinajs.cn/t35/style/images/common/face/ext/normal/e9/sk_thumb.gif",
              alt: "[思考]"
            },
            {
              src:
                "http://img.t.sinajs.cn/t35/style/images/common/face/ext/normal/24/sweata_thumb.gif",
              alt: "[汗]"
            },
            {
              src:
                "http://img.t.sinajs.cn/t35/style/images/common/face/ext/normal/7f/sleepya_thumb.gif",
              alt: "[困]"
            },
            {
              src:
                "http://img.t.sinajs.cn/t35/style/images/common/face/ext/normal/6b/sleepa_thumb.gif",
              alt: "[睡觉]"
            },
            {
              src:
                "http://img.t.sinajs.cn/t35/style/images/common/face/ext/normal/90/money_thumb.gif",
              alt: "[钱]"
            },
            {
              src:
                "http://img.t.sinajs.cn/t35/style/images/common/face/ext/normal/0c/sw_thumb.gif",
              alt: "[失望]"
            },
            {
              src:
                "http://img.t.sinajs.cn/t35/style/images/common/face/ext/normal/40/cool_thumb.gif",
              alt: "[酷]"
            },
            {
              src:
                "http://img.t.sinajs.cn/t35/style/images/common/face/ext/normal/8c/hsa_thumb.gif",
              alt: "[花心]"
            },
            {
              src:
                "http://img.t.sinajs.cn/t35/style/images/common/face/ext/normal/49/hatea_thumb.gif",
              alt: "[哼]"
            },
            {
              src:
                "http://img.t.sinajs.cn/t35/style/images/common/face/ext/normal/36/gza_thumb.gif",
              alt: "[鼓掌]"
            },
            {
              src:
                "http://img.t.sinajs.cn/t35/style/images/common/face/ext/normal/d9/dizzya_thumb.gif",
              alt: "[晕]"
            },
            {
              src:
                "http://img.t.sinajs.cn/t35/style/images/common/face/ext/normal/1a/bs_thumb.gif",
              alt: "[悲伤]"
            },
            {
              src:
                "http://img.t.sinajs.cn/t35/style/images/common/face/ext/normal/62/crazya_thumb.gif",
              alt: "[抓狂]"
            },
            {
              src:
                "http://img.t.sinajs.cn/t35/style/images/common/face/ext/normal/91/h_thumb.gif",
              alt: "[黑线]"
            },
            {
              src:
                "http://img.t.sinajs.cn/t35/style/images/common/face/ext/normal/6d/yx_thumb.gif",
              alt: "[阴险]"
            },
            {
              src:
                "http://img.t.sinajs.cn/t35/style/images/common/face/ext/normal/89/nm_thumb.gif",
              alt: "[怒骂]"
            },
            {
              src:
                "http://img.t.sinajs.cn/t35/style/images/common/face/ext/normal/40/hearta_thumb.gif",
              alt: "[心]"
            },
            {
              src:
                "http://img.t.sinajs.cn/t35/style/images/common/face/ext/normal/ea/unheart.gif",
              alt: "[伤心]"
            },
            {
              src:
                "http://img.t.sinajs.cn/t35/style/images/common/face/ext/normal/58/pig.gif",
              alt: "[猪头]"
            },
            {
              src:
                "http://img.t.sinajs.cn/t35/style/images/common/face/ext/normal/d6/ok_thumb.gif",
              alt: "[ok]"
            },
            {
              src:
                "http://img.t.sinajs.cn/t35/style/images/common/face/ext/normal/d9/ye_thumb.gif",
              alt: "[耶]"
            },
            {
              src:
                "http://img.t.sinajs.cn/t35/style/images/common/face/ext/normal/d8/good_thumb.gif",
              alt: "[good]"
            },
            {
              src:
                "http://img.t.sinajs.cn/t35/style/images/common/face/ext/normal/c7/no_thumb.gif",
              alt: "[不要]"
            },
            {
              src:
                "http://img.t.sinajs.cn/t35/style/images/common/face/ext/normal/d0/z2_thumb.gif",
              alt: "[赞]"
            },
            {
              src:
                "http://img.t.sinajs.cn/t35/style/images/common/face/ext/normal/40/come_thumb.gif",
              alt: "[来]"
            },
            {
              src:
                "http://img.t.sinajs.cn/t35/style/images/common/face/ext/normal/d8/sad_thumb.gif",
              alt: "[弱]"
            },
            {
              src:
                "http://img.t.sinajs.cn/t35/style/images/common/face/ext/normal/91/lazu_thumb.gif",
              alt: "[蜡烛]"
            },
            {
              src:
                "http://img.t.sinajs.cn/t35/style/images/common/face/ext/normal/6a/cake.gif",
              alt: "[蛋糕]"
            },
            {
              src:
                "http://img.t.sinajs.cn/t35/style/images/common/face/ext/normal/d3/clock_thumb.gif",
              alt: "[钟]"
            },
            {
              src:
                "http://img.t.sinajs.cn/t35/style/images/common/face/ext/normal/1b/m_thumb.gif",
              alt: "[话筒]"
            }
          ]
        }
      ];

      self.editor.customConfig.zIndex = 100;
      self.editor.customConfig.menuFixed = false;
      // 设置 headers（举例）
      self.editor.customConfig.uploadHeaders = {
        Accept: "*"
      };
      // 上传图片
      self.editor.customConfig.customUploadImg = function(files, insert) {
        var file = files[0];
        var formdata = new FormData();
        formdata.append("file", file);
        formdata.append("appKey", 111111);
        formdata.append("ext", file.name.split(".")[1]);
        formdata.append("fileSize", file.size);
        var text = "";
        var possible =
          "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789";
        for (var i = 0; i < 16; i++) {
          text += possible.charAt(Math.floor(Math.random() * possible.length));
        }
        var shaCode = crypto.createHash("md5");
        var md5Str = shaCode
          .update(text, "utf-8")
          .digest("hex")
          .toUpperCase();
        formdata.append("md5", md5Str);
        self
          .getfileuploadPic(formdata)
          .then(data => {
            if (data.statusCode == 200) {
              self.$message({
                message: "上传图片成功",
                type: "success"
              });
              insert(data.data.url);
            } else {
              self.$message({
                type: "info",
                message: data.statusMessage
              });
            }
          })
          .catch(msg => {
            self.$message({
              type: "info",
              message: "服务器异常"
            });
          });
      };
      // 隐藏掉插入网络图片功能。
      self.editor.customConfig.showLinkImg = false;
      self.editor.customConfig.onchange = function() {
        self.contentVal = self.editor.txt.html();
        self.inputText = self.editor.txt.text();
      };
      self.editor.create();
      self.editor.txt.html(self.inputContentHtml);
      self.contentVal = self.editor.txt.html();
      self.inputText = self.editor.txt.text();
    },
    // 选择上传图片
    onFileChange(e) {
      var self = this;
      var files = e.target.files || e.dataTransfer.files;
      var fileData = files[0];
      var reader = new FileReader();
      reader.onload = function(e) {
        var data = e.target.result;
        var image = new Image();
        image.onload = function() {
          if (image.width !== 750 || image.height !== 300) {
            self.isRedcoverImgVal = true;
            self.isGraycoverImgVal = false;
          } else if (fileData.size > 5242880) {
            self.isRedcoverImgVal = true;
            self.isGraycoverImgVal = false;
          } else {
            self.isRedcoverImgVal = false;
            self.isGraycoverImgVal = true;
            self.uploadImage(files[0]);
          }
        };
        image.src = data;
      };
      reader.readAsDataURL(fileData);
    },
    // 上传图片
    uploadImage(file) {
      var self = this;
      var formdata = new FormData();
      formdata.append("file", file);
      formdata.append("appKey", 111111);
      formdata.append("ext", file.name.split(".")[1]);
      formdata.append("fileSize", file.size);
      var text = "";
      var possible =
        "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789";
      for (var i = 0; i < 16; i++) {
        text += possible.charAt(Math.floor(Math.random() * possible.length));
      }
      var shaCode = crypto.createHash("md5");
      var md5Str = shaCode
        .update(text, "utf-8")
        .digest("hex")
        .toUpperCase();
      formdata.append("md5", md5Str);
      self
        .getfileuploadPic(formdata)
        .then(data => {
          if (data.statusCode == 200) {
            self.$message({
              message: "上传图片成功",
              type: "success"
            });
            self.coverImg = data.data.url;
            document.getElementById("logofile").value = "";
          } else {
            self.$message({
              type: "info",
              message: data.statusMessage
            });
          }
        })
        .catch(msg => {
          self.$message({
            type: "info",
            message: "服务器异常"
          });
        });
    },
    upload: function() {
      document.getElementById("logofile").click();
    },
    // 取消
    cancelsClick() {
      var self = this;
      self.$router.push({
        path: "/home/information/enterpriseformation"
      });
    },
    ...mapActions([
      "getWebInfoDetail",
      "getWebInfoParent",
      "getWebInfoUpdate",
      "getfileuploadPic"
    ])
  },
  watch: {
    titleVal(val) {
      if (val) {
        var strReg = new RegExp(
          "[+`~@#$^&*()=|{}\\[\\]<>/@#￥&*;（）——|{}【】]"
        );
        if (strReg.test(val) == true) {
          this.isRedTitleVal = true;
          this.isGrayTitleVal = false;
        } else {
          this.isRedTitleVal = false;
          this.isGrayTitleVal = true;
        }
      } else {
        this.isRedTitleVal = false;
        this.isGrayTitleVal = true;
      }
    },
    contentVal(val) {
      var self = this;
      if (val) {
        if (val.length > 0) {
          this.isRedContentHtmlVal = false;
          this.isGrayContentHtmlVal = true;
        } else {
          this.isRedContentHtmlVal = true;
          this.isGrayContentHtmlVal = false;
        }
      } else {
        this.isRedContentHtmlVal = true;
        this.isGrayContentHtmlVal = false;
      }
    }
  }
};
</script>
<style scoped>
.opNotice {
  overflow: hidden;
  width: 100%;
  background-color: #fff;
  min-height: 500px;
  padding-bottom: 20px;
}

.opNoticeTop div {
  color: #303030;
  font-size: 14px;
  padding-top: 24px;
  padding-bottom: 12px;
  margin-left: 44px;
  width: calc(100% - 88px);
  border-bottom: 1px solid #d9d9d9;
}

.opNoticeTop {
  width: 100%;
}

.opNoticeMain {
  margin-left: 44px;
  width: calc(100% - 88px);
}

.opNoticeMain .item span {
  color: rgb(180, 16, 16);
}

.opNoticeMain .item input {
  width: 240px;
  height: 34px;
  border-radius: 4px;
  padding-left: 10px;
}

.opNoticeMain .item select {
  width: 200px;
  height: 34px;
  border-radius: 4px;
  padding-left: 20px;
  color: #8e8f94;
}

.opNoticeMain .item > div:nth-child(1) {
  margin-right: 10px;
}

.opNoticeMain .item:nth-child(2) > div:nth-child(1) {
  margin-left: 28px;
}

.opNoticeMain .item:nth-child(3) > div:nth-child(1) {
  margin-left: 28px;
}

.opNoticeMain .item:nth-child(4) > div:nth-child(1) {
  margin-left: 28px;
}

.opNoticeMain .item:nth-child(4),
.opNoticeMain .item:nth-child(5) {
  align-items: flex-start;
}

.opNoticeMain .item:nth-child(5) {
  margin-top: 24px;
  position: relative;
}

.opNoticeMain .item:nth-child(5) img {
  width: 80px;
  height: 80px;
  border: 1px solid #d9d9d9;
}

.opNoticeMain .item:nth-child(5) input {
  width: 80px;
  height: 30px;
  line-height: 30px;
  background: #38adff;
  font-size: 14px;
  color: #fff;
  position: absolute;
  left: 183px;
  text-align: center;
  padding: 0;
  bottom: 40px;
  cursor: pointer;
}
.opNoticeMain .item:nth-child(5) input:hover {
  background: #2a87ca;
}
#coverImgTips {
  /* color: #8f8e94; */
  padding-bottom: 10px !important;
}

.button {
  display: flex;
  justify-content: center;
  margin: 30px auto;
}

.button > .el-button {
  margin-right: 50px;
}
.button > div:nth-child(1) {
  background: #38adff;
}

.button > div:nth-child(2) {
  background: #8e8f94;
}

/* 编译器 */

.editorBox {
  width: 80%;
}

.opNoticeMain .item {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  margin-top: 24px;
}

#inputTips {
  display: inline;
  margin-left: 20px;
}

#editorTips {
  margin-top: 10px;
}

/* ***************************************************** */

.centerLeftBotOneI {
  width: 310px;
  height: 30px;
  line-height: 30px;
  font-size: 15px;
  color: #000;
}

.selectPopup-but {
  height: 60px;
  width: 100%;
  background-color: #f0f6fa;
  display: flex;
  justify-content: space-between;
  align-items: center;
  border-top: 1px solid #e5e5e5;
}

.selectPopup-but > div:nth-child(2) {
  width: 55px;
  height: 35px;
  border-radius: 4px;
  background-color: #38adff;
  text-align: center;
  line-height: 35px;
  color: #fff;
  margin-right: 25px;
  cursor: pointer;
}

.slide-fade-enter-active {
  transition: all 0.7s ease;
}

.slide-fade-enter,
.slide-fade-leave-active {
  transform: translateY(-30px);
  opacity: 0;
}

.redBorder {
  border: 1px solid #38adff !important;
}

.grayBorder {
  border: 1px solid #d9d9d9 !important;
}

.redTest {
  color: #38adff !important;
}

.grayTest {
  color: #8e8f94 !important;
}

input::-webkit-input-placeholder {
  color: #8e8f94;
  font-size: 13px;
}

input::-moz-placeholder {
  /* Mozilla Firefox 19+ */
  color: #8e8f94;
  font-size: 13px;
}

input:-moz-placeholder {
  /* Mozilla Firefox 4 to 18 */
  color: #8e8f94;
  font-size: 13px;
}

input:-ms-input-placeholder {
  /* Internet Explorer 10-11 */
  color: #8e8f94;
  font-size: 13px;
}
</style>